<template>
	<view style="width: 100%;height: 100%;">
		<cu-custom :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">我领的券</block>
		</cu-custom>
		<scroll-view v-if="hasShop" scroll-x class="bg-white nav">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in navItems" :key="index"
				 @tap="tabSelect" :data-id="index">
					{{item}}
				</view>
			</view>
		</scroll-view>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption">
			<view v-for="(voucher,index) in dataList" :key="index">
				<subscribe-voucher-item v-if="TabCur==0" :voucher="voucher" @useNow="useVoucherNow(voucher)"></subscribe-voucher-item>
				<voucher-policy-detail v-if="TabCur==1" :status="voucher.status" :sence="3" :leftAmount="voucher.left_amount" :voucherSn="voucher.voucher_sn" :policy="voucher.policy"></voucher-policy-detail>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import SubscribeVoucherItem from '@/pages/always/components/subscribe-voucher-item/subscribe-voucher-item.vue';
	import VoucherPolicyDetail from '@/components/voucher-policy-detail.vue';
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import {
		getMySubscribeVoucherList,
		unlockSubscribe,
		getMyVoucherList,
		getShopDetail
	} from '@/api/api.js'
	import config from '@/api/config.js'
	export default {
		components:{
			SubscribeVoucherItem,
			VoucherPolicyDetail
		},
		mixins: [MescrollMixin],
		data() {
			return {
				hasShop:false,
				scrollLeft: 0,
				navItems:[
					'订阅券',
					'代金券'
				],
				TabCur: 0,
				dataList: [],
				upOption: {
					page: {
						size: 10 // 每页数据的数量,默认10
					},
					textNoMore: config.customNoMore,
					noMoreSize: 1, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						tip: '暂无相关数据'
					}
				}
			}
		},
		onLoad() {
			// #ifndef MP-WEIXIN
			this.hasShop = false
			return
			// #endif
			if(config.selfMallOpen == 0) {
				this.hasShop = false
				return
			}
			getShopDetail(1).then(res=>{
				if(res.data.status == 1) {
					this.hasShop = true
				}else{
					this.hasShop = false
				}
			})
		},
		methods: {
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
				if (this.mescroll) {
					this.mescroll.triggerDownScroll()
				}
			},
			useVoucherNow(voucher) 
			{
				uni.showLoading({
					title:'拼命解锁...'
				})
				unlockSubscribe(voucher.policy.forum_id,voucher.policy_id,voucher.unlock_sn).then(res=>{
					uni.hideLoading()
					voucher.status = 1
					uni.showToast({
						title:'解锁成功!'
					})
				}).catch(error=>{
					uni.hideLoading()
				})
			},
			getDataList(pageIndex, pageSize) {
				if(this.TabCur == 0) {
					getMySubscribeVoucherList(pageIndex, pageSize).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = res.data.list
						} else {
							this.dataList = this.dataList.concat(res.data.list)
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
						console.log(error)
						console.log('获取订阅券失败')
					})
				}else if(this.TabCur == 1) {
					getMyVoucherList(pageIndex, pageSize).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = res.data.list
						} else {
							this.dataList = this.dataList.concat(res.data.list)
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
						console.log(error)
						console.log('获取订阅券失败')
					})
				}
			},
			downCallback() {
				if (this.mescroll) {
					this.mescroll.resetUpScroll()
				}
			},
			upCallback(page) {
				this.getDataList(page.num - 1, page.size)
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>
